﻿<%@ Page Language="C#" StylesheetTheme="south-street" %>

<%@ Import Namespace="System.Drawing" %>
<%@ Import Namespace="System.IO" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    protected void OnColorChanged(object sender, EventArgs e)
    {
        ColorLabel.ForeColor = Color.FromName(ColorDropDown.SelectedValue);
    }

    protected void GetServerTime(object sender, EventArgs e)
    {
        lbTimer.Text = "Server Time:" + DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
    }

    protected void PropertiesChanged(object sender, EventArgs e)
    {
        SampleTab.Sortable = cbSortable.Checked;
        SampleTab.Collapsible = cbCollapsible.Checked;
        SampleTab.Deselectable = cbDeselectable.Checked;
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <DotNetAge:Tabs ID="SampleTab" runat="server" Height="276px" Width="470px" SelectedIndex="2">
            <Views>
                <DotNetAge:View ID="View3" runat="server" Text="Description">
                    <p>
                        Tabs is a ASP.NET WebControl that encapsulated the jQuery UI tabs plugin.Tabs are
                        generally used to break content into multiple sections that can be swapped to save
                        space, much like an Accordion.
                    </p>
                    <p>
                        By default a Tabs will swap between tabbed sections onClick, but the events can
                        be changed to onHover through an property. Tab content can be loaded via Ajax by
                        setting an NavigateUrl on a View Control.
                    </p>
                </DotNetAge:View>
                <DotNetAge:View ID="View5" runat="server" Text="Tab settings">
                    <div>
                        <h6>
                            <b>Controls' Properies:</b></h6>
                        <div class="dna-demo-fields">
                            <ul>
                                <li><span>Sortable</span><asp:CheckBox ID="cbSortable" runat="server" OnCheckedChanged="PropertiesChanged"
                                    AutoPostBack="true" Text="" /></li>
                                <li><span>Deselectable</span><asp:CheckBox ID="cbDeselectable" runat="server" OnCheckedChanged="PropertiesChanged"
                                    AutoPostBack="true" /></li>
                                <li><span>Collapsible</span><asp:CheckBox ID="cbCollapsible" runat="server" OnCheckedChanged="PropertiesChanged"
                                    AutoPostBack="true" /></li>
                            </ul>
                        </div>
                    </div>
                </DotNetAge:View>
                <DotNetAge:View ID="View2" runat="server" Text="Using UpdatePanel">
                    <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                        <ProgressTemplate>
                            <div class="dna-state-loading-s">
                                <div>
                                </div>
                            </div>
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <div>
                                Colors:<asp:DropDownList ID="ColorDropDown" runat="server" AutoPostBack="true" Width="150"
                                    OnSelectedIndexChanged="OnColorChanged">
                                    <asp:ListItem Text="Black" Style="background-color: Black; color: White;" Value="Black"></asp:ListItem>
                                    <asp:ListItem Text="Red" Style="background-color: Red; color: White;" Value="Red"></asp:ListItem>
                                    <asp:ListItem Text="Blue" Style="background-color: Blue; color: White;" Value="Blue"></asp:ListItem>
                                </asp:DropDownList>
                            </div>
                            <div>
                                <asp:Label ID="ColorLabel" runat="server" Text="Choice the color above the DropDownList to change this label's color"></asp:Label></div>
                            <br />
                            <br />
                            <div>
                                <asp:Label ID="lbTimer" runat="server" Text="Click the 'Go' button to load the server time."></asp:Label></div>
                            <br />
                            <br />
                            <div>
                                <asp:Button ID="Button1" runat="server" Text="Go" OnClick="GetServerTime"></asp:Button>
                            </div>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </DotNetAge:View>
            </Views>
        </DotNetAge:Tabs>
    </div>
    </form>
</body>
</html>
